// 某个todo
import ChannelLevel from './channelLevel';
import classs from './TodoList.module.scss'
const TodoItem = (props) => {
  return (<div className={classs.todoItem}>
    <ul>
      {
        props.todoList.map((item, key) => (
          <li key={key}>{key + 1}.{item.title}
            <span index={item.level}
              className={[item.level === '1' ? classs.level1 : '' || item.level === '2' ? classs.level2 : '' || item.level === '3' ? classs.level3 : '', classs.level].join(' ')}>{item.level}</span>
            <ChannelLevel todoList={props.todoList} setTodo={props.setTodo} index={key} />
          </li>))
      }
    </ul>
  </div >);
}

export default TodoItem;